<template>
  <div class="main">
    <van-row class="van_row">
      <van-nav-bar
        title="入驻品质优品"
        left-text=""
        right-text=""
        left-arrow
        fixed
        @click-left="onClickLeft"
      />
    </van-row>
    <van-form @submit="onSubmit">
      <van-field
        v-model="fromData.username"
        name="公司名称"
        label="公司名称"
        placeholder="输入内容"
        :rules="[{ required: true, message: '请填写公司名称' }]"
      />
      <van-field
        v-model="fromData.brand"
        name="品牌"
        label="品牌"
        placeholder="输入内容"
        :rules="[{ required: true, message: '请填写输入品牌' }]"
      />

      <van-field
        v-model="fromData.product"
        name="产品"
        label="产品"
        placeholder="输入内容"
        :rules="[{ required: true, message: '请填写输入产品' }]"
      />
      <van-field
        v-model="fromData.contacts"
        name="联系人"
        label="联系人"
        placeholder="输入内容"
        :rules="[{ required: true, message: '请填写输入联系人' }]"
      />
      <van-field
        v-model="fromData.contactNumber"
        name="联系电话"
        label="联系电话"
        placeholder="输入内容"
        :rules="[{ required: true, message: '请填写输入联系电话' }]"
      />
      <van-field
        v-model="fromData.mailbox"
        name="邮箱"
        label="邮箱"
        placeholder="输入内容"
        :rules="[{ required: true, message: '请填写输入邮箱' }]"
      />
      <van-field
        v-model="fromData.receivingAddress"
        name="收件地址"
        label="收件地址"
        placeholder="输入内容"
        :rules="[{ required: true, message: '请填写输入收件地址' }]"
      />
      <div  class="div_bottom">
        <van-button round block type="info" native-type="submit"
          >提交</van-button
        >
      </div>
    </van-form>
  </div>
</template>
<script>
export default {
  name: "",
  data() {
    return {
      fromData: {
        username: "",
        brand: "",
        product: "",
        contacts: "",
        contactNumber: "",
        mailbox: "",
        receivingAddress: "",
      },
    };
  },
  methods: {
    //   返回按钮
    onClickLeft() {
      this.$router.push({path:"/qualityArchivestu"})

      // 带查询参数，变成/backend/order?selected=2
    // this.$router.push({path: '/backend/order', query: {selected: "2"}});
    },
    // 提交按钮
    onSubmit(values) {
      console.log("submit", values);
    },
  },
};
</script>

<style scoped lang='less'>
.van_row {
  position: relative;
  .van-nav-bar {
    color: rgba(42, 131, 78, 1);
    background-color: rgba(239, 239, 239, 1);
    font-size: 14px;

    text-align: center;
    /deep/div.van-nav-bar__title {
      font-size: 18px;
      color: rgba(42, 131, 78, 1);
    }
  }
  .van-nav-bar_after {
    position: fixed;
    width: 77px;
    height: 29px;
    border-radius: 50px;
    border: 1px solid silver;
    line-height: 29px;
    text-align: center;
    font-size: 16px;
    z-index: 13;
    top: 8px;
    right: 10px;
  }
}
.van-form {
  margin-top: 89px;
  .van-field{
      margin: 5px 0;
  }
  .div_bottom{
      padding: 54px;
      .van-button--info {
          background-color: green;
          border: none;
      }
  }
}
</style>